html,
body {
    height: 100%;
}

body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: #eeeeee;
}
 
.navbar {
    height: 50px;
    line-height: 50px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #0b0b0b;
    color: #ffffff;
}

.navbar .left,
.navbar .right {
    width: 50px;
}

.tab-nav {
    margin: 0;
    height: 50px;
    line-height: 50px;
    background-color: #ffffff;
}

.tab-nav .swiper-slide {
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #dcdcdc;
}

.tab-nav .swiper-slide.active {
    color: red;
    border-bottom-color: red;
}

.main {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
/*    -webkit-overflow-scrolling: touch;*/
}

.tab-cont {
    height: 100%;
}

.tab-cont .swiper-slide{
    overflow-y: auto;
}

.order-list {
    padding: 1em;
    margin-top: 1em;
    background-color: #ffffff;
    border-bottom: 1px solid #dcdcdc;
}

.order-status{
    display: flex;
    justify-content: space-between;
}

